<template>
	<view class="min-h-screen">
		<view class="mescroll-box" :class="{ 'cart': config.cart.control && config.cart.event === 'cart', 'detail': !(config.cart.control && config.cart.event === 'cart') }" v-if="tabsData.length">
			<mescroll-body ref="mescrollRef" :down="{ use: false }" @init="mescrollInit" @up="getListFn">
				<view v-if="config.search.control" class="search-box z-10 fixed top-0 left-0 right-0 h-[106rpx] box-border">
          <view class="flex items-center h-[70rpx] absolute left-[56rpx] top-[18rpx]  z-2">
<!--            <u-icon v-if="searchName" name="close-circle-fill" color="#999999" size="28rpx" @click="searchName=''"></u-icon>-->
            <view class="h-[70rpx] w-[40rpx] text-center leading-[70rpx]" @click.stop="searchNameFn">
              <text class="nc-iconfont nc-icon-sousuo-duanV6xx1 text-[32rpx] text-[#999999]"></text>
            </view>
          </view>
					<input class="search-ipt text-[24rpx] input_st text-[#999999] !pl-[100rpx]" :class="{'pr-[106rpx]':searchName,'pr-[32rpx]':!searchName}" type="text" v-model="searchName" :placeholder="config.search.title"  @confirm="searchNameFn">
          <image src="@/image/go-button.png" style="height: 66rpx;position: absolute;width: 126rpx;right: 22rpx;top: 50%;transform: translateY(-50%)" @click.stop="searchNameFn"/>
        </view>
				<!--  #ifdef  H5 -->
				<view class="tabs-box z-2 fixed left-0 bottom-[50px] top-0" :class="{ '!top-[106rpx]': config.search.control, 'pb-[98rpx]': config.cart.control && config.cart.event === 'cart' }">
					<scroll-view :scroll-y="true" class="scroll-height">
						<view class="">
							<view class="tab-item truncate" :class="{ 'tab-item-active': index == tabActive,'rounded-br-[12rpx]':tabActive-1===index,'rounded-tr-[12rpx]':tabActive+1===index}" v-for="(item, index) in tabsData" :key="index" @click="firstLevelClick(index, item)">
								<view class="text-box px-[16rpx] truncate">
									{{ item.category_name }}
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
				<!--  #endif -->
				<!--  #ifndef  H5 -->
				<view class="tabs-box z-2 fixed left-0 pb-ios bottom-[100rpx] top-0" :class="{ 'top-[106rpx]': config.search.control, '!bottom-[198rpx]': config.cart.control && config.cart.event === 'cart' }">
					<scroll-view :scroll-y="true" class="scroll-height">
						<view class="">
							<view class="tab-item truncate" :class="{ 'tab-item-active': index == tabActive,'rounded-br-[12rpx]':tabActive-1===index,'rounded-tr-[12rpx]':tabActive+1===index}" v-for="(item, index) in tabsData" :key="index" @click="firstLevelClick(index, item)">
								<view class="text-box px-[16rpx] truncate">
									{{ item.category_name }}
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
				<!--  #endif -->
				<view class="flex flex-wrap pl-[182rpx] pb-[20rpx] pt-[20rpx]">
					<template v-for="(item, index) in list" :key="item.goods_id">
						<view
							class="box-border w-full flex mx-[16rpx] px-[24rpx] py-[20rpx] rounded-[12rpx] good-class"
							:class="{ 'mt-[16rpx]': index }" @click.stop="toLink(item.goods_id)">
							<view class="">
								<u--image width="100%" height="240rpx" radius="12rpx 12rpx 0 0" :src="img(item.goods_cover_thumb_mid ? item.goods_cover_thumb_mid : '')" model="aspectFill">
									<template #error>
										<image class="overflow-hidden w-[100%] h-[240rpx]" :src="img('static/resource/images/diy/shop_default.jpg')" mode="aspectFill"></image>
									</template>
								</u--image>
							</view>
							<view class="flex flex-1 ml-[15rpx] mr-[15rpx] flex-wrap">
								<view class="w-[316rpx] max-h-[80rpx] text-[28rpx] leading-[40rpx] multi-hidden good-name-color title_st mt-[15rpx]">
									{{ item.goods_name }}
								</view>
								<view class="w-[316rpx] flex self-end items-end justify-between mb-[15rpx] mt-[5rpx]">
									<view class="text-[var(--price-text-color)] price-font">
										<text class="text-[26rpx] font-500">￥</text>
										<text class="text-[36rpx] font-500">{{ parseFloat(goodsPrice(item)).toFixed(2).split('.')[0] }}</text>
										<text class="text-[24rpx] font-500">.{{ parseFloat(goodsPrice(item)).toFixed(2).split('.')[1] }}</text>
										<image class="h-[24rpx] ml-[6rpx]" v-if="priceType(item) == 'member_price'" :src="img('addon/shop/VIP.png')" mode="heightFix" />
										<image class="h-[24rpx] ml-[6rpx]" v-if="priceType(item) == 'discount_price'" :src="img('addon/shop/discount.png')" mode="heightFix" />
									</view>
									<view
										v-if="
										(item.goods_type == 'real' || (item.goods_type == 'virtual' && item.virtual_receive_type != 'verify')) &&
										item.goodsSku.sku_spec_format === '' && cartList['goods_' + item.goods_id] && cartList['goods_' + item.goods_id]['sku_' + item.goodsSku.sku_id] && config.cart.control && config.cart.event === 'cart'"
										class="flex items-center">
										<text class="text-[44rpx] text-color nc-iconfont nc-icon-jianshaoV6xx"
											@click.stop="reduceCart(cartList['goods_' + item.goods_id]['sku_' + item.goodsSku.sku_id])"></text>
										<text class="text-[#333] text-[24rpx] mx-[16rpx]">
											{{ cartList['goods_' + item.goods_id]['sku_' + item.goodsSku.sku_id].num }}</text>
										<text class="text-[44rpx] text-color iconfont iconjiahao2fill"
											:id="'itemCart' + index"
											@click.stop="addCartBtn(item,cartList['goods_' + item.goods_id]['sku_' + item.goodsSku.sku_id],'itemCart' + index)"></text>
									</view>
									<template v-else-if="(item.goods_type == 'virtual' && config.cart.event !== 'cart') || item.goods_type == 'real'">
<!--										<view v-if="config.cart.control && config.cart.style === 'style-1'" class="h-[44rpx] relative">-->
<!--											<view :id="'itemCart' + index" class="text-[#fff] bg-color h-[44rpx] text-[24rpx] px-[10px] leading-[44rpx] rounded-[22rpx]" @click.stop="itemCart(item, 'itemCart' + index)">-->
<!--												{{ config.cart.text }}-->
<!--											</view>-->
<!--											<view-->
<!--												v-if="cartList['goods_' + item.goods_id] && cartList['goods_' + item.goods_id].totalNum"-->
<!--												:class="['absolute right-[-16rpx] top-[-16rpx] rounded-[30rpx] h-[30rpx] min-w-[30rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border box-border border-[2rpx] border-solid border-[#fff]', cartList['goods_' + item.goods_id].totalNum > 9 ? 'px-[10rpx]' : '']">-->
<!--												{{ cartList['goods_' + item.goods_id].totalNum }}-->
<!--											</view>-->
<!--										</view>-->
										<view v-if="config.cart.control && config.cart.style === 'style-2'" class="w-[44rpx] h-[44rpx] relative">
											<text :id="'itemCart' + index"
												class="text-color nc-iconfont nc-icon-tianjiaV6xx text-[44rpx]"
												@click.stop="itemCart(item, 'itemCart' + index)"></text>
											<view
												v-if="cartList['goods_' + item.goods_id] && cartList['goods_' + item.goods_id].totalNum"
												:class="['absolute right-[-16rpx] top-[-16rpx] rounded-[30rpx] h-[30rpx] min-w-[30rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border box-border border-[2rpx] border-solid border-[#fff]', cartList['goods_' + item.goods_id].totalNum > 9 ? 'px-[10rpx]' : '']">
												{{ cartList['goods_' + item.goods_id].totalNum }}
											</view>
										</view>
										<view v-if="config.cart.control && config.cart.style === 'style-3'" class="w-[44rpx] h-[44rpx] relative">
											<text :id="'itemCart' + index"
												class="text-color nc-iconfont nc-icon-gouwucheV6xx-2 !text-[44rpx]"
												@click.stop="itemCart(item, 'itemCart' + index)"></text>
											<view
												v-if="cartList['goods_' + item.goods_id] && cartList['goods_' + item.goods_id].totalNum"
												:class="['absolute right-[-16rpx] top-[-16rpx] rounded-[30rpx] h-[30rpx] min-w-[30rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border box-border border-[2rpx] border-solid border-[#fff]', cartList['goods_' + item.goods_id].totalNum > 9 ? 'px-[10rpx]' : '']">
												{{ cartList['goods_' + item.goods_id].totalNum }}
											</view>
										</view>
										<view v-if="config.cart.control && config.cart.style === 'style-4'" class="w-[44rpx] h-[44rpx] relative">
											<view :id="'itemCart' + index"
												class=" flex items-center justify-center text-[#fff] bg-color h-[44rpx] w-[44rpx] rounded-[22rpx] text-center"
												@click.stop="itemCart(item, 'itemCart' + index)">
												<text class="nc-iconfont nc-icon-gouwucheV6xx-2 !text-[26rpx]"></text>
											</view>
											<view
												v-if="cartList['goods_' + item.goods_id] && cartList['goods_' + item.goods_id].totalNum"
												:class="['absolute right-[-16rpx] top-[-16rpx] rounded-[30rpx] h-[30rpx] min-w-[30rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border border-[2rpx] border-solid border-[#fff]', cartList['goods_' + item.goods_id].totalNum > 9 ? 'px-[10rpx]' : '']">
												{{ cartList['goods_' + item.goods_id].totalNum }}
											</view>
										</view>
									</template>
								</view>
							</view>
						</view>

					</template>
					<view class="mx-[24rpx]  w-[536rpx] rounded-[12rpx] flex items-center justify-center dis_flex" :class="{'noData1':config.search.control,'noData2':!(config.search.control)}" v-if="!list.length && !loading && listLoading">
<!--						<mescroll-empty :option="{tip : '暂无商品'}"></mescroll-empty>-->
            <img src="@/image/goods/no_data.png" alt="" class="h-[242rpx] w-[297.44rpx]"/>
            <text class="text-[#999] text-[30rpx] mt-[20rpx]">暂无商品</text>
					</view>
				</view>
				<add-cart-popup ref="cartRef" />
			</mescroll-body>
			<!--  #ifdef  H5 -->
			<view v-if="config.cart.control && config.cart.event === 'cart'"
				class="bg-[#fff] z-10 flex justify-between items-center fixed left-0 right-0 bottom-[50px] box-solid px-[24rpx] py-[17rpx] mb-ios">
				<view class="flex items-center">
					<view class="w-[66rpx] h-[66rpx] mr-[27rpx] relative">
						<view id="animation-end" class="w-[66rpx] h-[66rpx] rounded-[35rpx] bg-[var(--primary-color)] text-center leading-[70rpx]" @click.stop="toCart">
							<text class="nc-iconfont nc-icon-gouwucheV6mm1 text-[#fff] text-[32rpx]"></text>
						</view>
						<view v-if="totalNum"
							:class="['absolute left-[50rpx] top-[-10rpx] rounded-[28rpx] h-[28rpx] min-w-[28rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border', totalNum > 9 ? 'px-[10rpx]' : '']">
							{{ totalNum > 99 ? "99+" : totalNum }}
						</view>
					</view>
					<text class="text-[32rpx] font-500 text-[#333]">总计：</text>
					<text class="text-[var(--price-text-color)] price-font">
						<text class="text-[26rpx] font-500">￥</text>
						<text class="text-[36rpx] font-500">{{ parseFloat(totalMoney).toFixed(2).split('.')[0] }}</text>
						<text class="text-[24rpx] font-500">.{{ parseFloat(totalMoney).toFixed(2).split('.')[1] }}</text>
					</text>
				</view>
				<button
					class="w-[180rpx] h-[66rpx] text-[28rpx] leading-[66rpx] !text-[#fff] m-0 rounded-full primary-btn-bg remove-border"
					shape="circle" @click="settlement">去结算</button>
			</view>
			<!--  #endif -->
			<!--  #ifndef  H5 -->
			<view v-if="config.cart.control && config.cart.event === 'cart'"
				class="bg-[#fff] z-10 flex justify-between items-center fixed left-0 right-0 bottom-[100rpx] box-solid px-[24rpx] py-[17rpx] mb-ios">
				<view class="flex items-center">
					<view class="w-[66rpx] h-[66rpx] mr-[27rpx] relative">
						<view id="animation-end"
							class="w-[66rpx] h-[66rpx] rounded-[35rpx] bg-[var(--primary-color)] text-center leading-[66rpx]"
							@click.stop="toCart">
							<text class="nc-iconfont nc-icon-gouwucheV6mm1 text-[#fff] text-[32rpx]"></text>
						</view>
						<view v-if="totalNum"
							:class="['absolute left-[50rpx] top-[-10rpx] rounded-[28rpx] h-[28rpx] min-w-[28rpx] text-center leading-[30rpx] bg-[#FF4646] text-[#fff] text-[20rpx] font-500 box-border', totalNum > 9 ? 'px-[10rpx]' : '']">
							{{ totalNum > 99 ? "99+" : totalNum }}
						</view>
					</view>
					<text class="text-[32rpx] font-500 text-[#333]">总计：</text>
					<text class="text-[var(--price-text-color)] price-font">
						<text class="text-[26rpx] font-500">￥</text>
						<text class="text-[36rpx] font-500">{{ parseFloat(totalMoney).toFixed(2).split('.')[0] }}</text>
						<text class="text-[24rpx] font-500">.{{ parseFloat(totalMoney).toFixed(2).split('.')[1] }}</text>
					</text>
				</view>
				<button
					class="w-[180rpx] h-[66rpx] text-[28rpx] leading-[66rpx] !text-[#fff] m-0 rounded-full primary-btn-bg remove-border"
					shape="circle" @click="settlement">去结算</button>
			</view>
			<!--  #endif -->
		</view>

		<view v-show="animationElStatus" :style="animationElStatus"
			class="fixed z-999 flex items-center justify-center text-[#fff] bg-color h-[44rpx] w-[44rpx] rounded-[22rpx] text-center">
			<text class=" nc-iconfont nc-icon-gouwucheV6xx-2 !text-[30rpx]"></text>
		</view>
		<view class="flex justify-center items-center w-[100%] h-[100vh]" v-if="!tabsData.length && !loading">
			<mescroll-empty :option="{tip : '暂无商品分类'}"></mescroll-empty>
		</view>
		<u-loading-page bg-color="rgb(248,248,248)" :loading="loading" loadingText="" fontSize="16" color="#303133"></u-loading-page>

		<tabbar />
		<!-- 强制绑定手机号 -->
		<bind-mobile ref="bindMobileRef" />
	</view>
</template>

<script setup lang="ts">
import { ref, onMounted, computed, getCurrentInstance } from 'vue';
import { t } from '@/locale';
import { img, redirect, getToken } from '@/utils/common';
import { getGoodsCategoryTree, getGoodsPages } from '@/addon/shop/api/goods';
import MescrollBody from '@/components/mescroll/mescroll-body/mescroll-body.vue';
import MescrollEmpty from '@/components/mescroll/mescroll-empty/mescroll-empty.vue';
import useMescroll from '@/components/mescroll/hooks/useMescroll.js';
import addCartPopup from './add-cart-popup.vue'
import bindMobile from '@/components/bind-mobile/bind-mobile.vue';
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
import { useLogin } from '@/hooks/useLogin'
import useMemberStore from '@/stores/member'
import useCartStore from '@/addon/shop/stores/cart'
import { cloneDeep } from 'lodash-es'

const cartStore = useCartStore();

// 查询购物车列表
cartStore.getList();

const cartList = computed(() => cartStore.cartList)
const totalNum = computed(() => cartStore.totalNum)
const totalMoney = computed(() => cartStore.totalMoney)
const memberStore = useMemberStore()
const userInfo = computed(() => memberStore.info)
const { mescrollInit, getMescroll } = useMescroll(onPageScroll, onReachBottom);
const prop = defineProps({
	config: {
		type: Object,
		default: (() => { return {} })
	},
    categoryId:{
	    type:[String,Number],
	    default:0
    }
})
let config = prop.config
let categoryId = prop.categoryId;
const list = ref<Array<Object>>([]);
const searchName = ref("");
const loading = ref<boolean>(true);//页面加载动画
const listLoading = ref<boolean>(false);//列表加载动画
const cartData = ref<Array<any>>([])
const instance = getCurrentInstance(); // 获取组件实例
cartData.value = uni.getStorageSync('shopCart') || []
interface acceptingDataStructure {
	data: acceptingDataItemStructure,
	msg: string,
	code: number
}
interface acceptingDataItemStructure {
	data: object,
	[propName: string]: number | string | object
}
interface mescrollStructure {
	num: number,
	size: number,
	endSuccess: Function,
	[propName: string]: any
}
const getListFn = (mescroll: mescrollStructure) => {
	listLoading.value = false
	getGoodsPages({
		page: mescroll.num,
		limit: mescroll.size,
		keyword: '', // 搜索关键词
		goods_category: categoryId, // 商品分类id
		brand_id: '', // 品牌id
		label_ids: '', // 标签id
		start_price: '', // 价格开始区间
		end_price: '', // 价格结束区间
		order: 'price', // 排序方式（综合：空，销量：sale_num，价格：price）
		sort: 'desc' // 升序：asc，降序：desc
	}).then((res: any) => {
		let newArr = res.data.data
		//设置列表数据

		if (mescroll.num == 1) {
			list.value = []; //如果是第一页需手动制空列表
		}
		list.value = list.value.concat(newArr);
		loading.value = false;
		mescroll.endSuccess(newArr.length);
		if (!list.value.length) listLoading.value = true
	}).catch(() => {
		loading.value = false;
		listLoading.value = true
		mescroll.endErr(); // 请求失败, 结束加载
	})
}

const toLink = (goods_id: string) => {
	redirect({ url: '/addon/shop/pages/goods/detail', param: { goods_id } })
}

onMounted(() => {
	getCategoryData()
})

//设置购物车动画
const animationElStatus = ref('')
const animationAddRepeatFlag = ref<Boolean>(false)
const cartRepeatFlag = ref<Boolean>(false)
const animationAddCart = (row: any, id: any) => {
	if (animationAddRepeatFlag.value || cartRepeatFlag.value) return false
	animationAddRepeatFlag.value = true
	cartRepeatFlag.value = true

	let obj: any = {
		goods_id: row.goodsSku.goods_id,
		sku_id: row.goodsSku.sku_id,
		sale_price: goodsPrice(row),
		stock: row.goodsSku.stock
	};
	if (row.id) {
		obj.num = row.num;
		obj.id = row.id;
	}
	cartStore.increase(obj, 1, () => {
		cartRepeatFlag.value = false
	});
	// #ifdef  MP-WEIXIN
	setTimeout(() => {
		uni.createSelectorQuery().in(instance).select('#animation-end').boundingClientRect((res: any) => {
			uni.createSelectorQuery().in(instance).select('#' + id).boundingClientRect((position: any) => {
				animationElStatus.value = `top: ${ position.top }px; left: ${ position.left }px;`
				setTimeout(() => {
					animationElStatus.value = `top: ${ res.top + res.height / 2 - position.height / 2 }px; left: ${ res.left + res.width / 2 - position.width / 2 }px; transition: all 0.8s; transform: rotate(-720deg);`
				}, 20);

				setTimeout(() => {
					animationElStatus.value = ''
					animationAddRepeatFlag.value = false
				}, 1020);

			}).exec()

		}).exec()
	}, 100)
	// #endif
	// #ifdef  H5
	setTimeout(() => {
		const animationEnd: any = window.document.getElementById('animation-end');
		const animationEndLeft = animationEnd.getBoundingClientRect().left;
		const animationEndTop = animationEnd.getBoundingClientRect().top;

		const itemCart: any = window.document.getElementById(id);
		const itemCartLift = itemCart.getBoundingClientRect().left;
		const itemCartTop = itemCart.getBoundingClientRect().top;
		animationElStatus.value = `top: ${ itemCartTop }px; left: ${ itemCartLift }px;`

		setTimeout(() => {
			animationElStatus.value = `top: ${ animationEndTop + animationEnd.offsetHeight / 2 - itemCart.offsetHeight / 2 }px; left: ${ animationEndLeft + animationEnd.offsetWidth / 2 - itemCart.offsetHeight / 2 }px; transition: all 0.8s; transform: rotate(-720deg);`
		}, 20);
		setTimeout(() => {
			animationElStatus.value = ''
			animationAddRepeatFlag.value = false
		}, 1020);

	}, 100);
	// #endif
}

//获取购物车数据
/**
 * @description 获取分类数据
 * */
const tabsData:any = ref<Array<Object>>([])
const getCategoryData = () => {
	loading.value = true;
	getGoodsCategoryTree().then((res: any) => {
		tabsData.value = res.data;
        if (categoryId) {
            for (let i = 0; i < tabsData.value.length; i++) {
                if (tabsData.value[i].category_id == categoryId) {
                    tabActive.value = i;
                    break;
                }
                if(tabsData.value[i].child_list){
                    for(let k=0;k<tabsData.value[i].child_list.length;k++){
                        if(tabsData.value[i].child_list[k].category_id == categoryId){
                            tabActive.value = i;
                            break;
                        }
                    }
                }
            }
        }else{
            categoryId = res.data[0].category_id;
        }
		loading.value = false;
	}).catch(() => {
		loading.value = false;
	});
}

// 一级菜单样式控制
const tabActive = ref<number>(0)

// 一级菜单点击事件
const firstLevelClick = (index: number, data: any) => {
	tabActive.value = index;
    categoryId = data.category_id;
	list.value = [];
	getMescroll().resetUpScroll();
}

// 搜索名字
const searchNameFn = () => {
	// getMescroll().resetUpScroll();
	if(searchName.value) redirect({ url: '/addon/shop/pages/goods/list', param: { goods_name: searchName.value } })
}

//强制绑定手机号
const bindMobileRef = ref(null)

//点击商品购物车按钮
const cartRef = ref()
const itemCart = (row: any, id: any) => {
    // 虚拟商品，并且需要核销，禁止加入购物车
    if(row.goods_type == 'virtual' && row.virtual_receive_type == 'verify'){
        return toLink(row.goodsSku.goods_id)
    }

	if (config.cart.event !== 'cart') {
		return toLink(row.goodsSku.goods_id)
	}

	if (!userInfo.value) {
		useLogin().setLoginBack({ url: '/addon/shop/pages/goods/category' })
		return false
	}
	// 绑定手机号
	if(uni.getStorageSync('isbindmobile')){
        bindMobileRef.value.open()
        return false
    }
	if (row.goodsSku.sku_spec_format) {
		cartRef.value.open(row.goodsSku.sku_id)
	} else {
		//单规格添加购物车
		if (parseInt(row.goodsSku.num||0) >= parseInt(row.goodsSku.stock)) {
		    uni.showToast({ title: '商品库存不足', icon: 'none' })
		    return;
		}
		animationAddCart(row, id)
	}
}
//点击购物车加号 添加数量
const addCartBtn = (item: any, row: any, id: string) => {
	if (parseInt(row.num) >= parseInt(row.stock)) {
	    uni.showToast({ title: '商品库存不足', icon: 'none' })
	    return;
	}

	let obj = cloneDeep(item)
    obj.num = row.num;
    obj.id = row.id;
	animationAddCart(obj, id)
}

//点击购物车减号
const reduceCart = (row: any) => {
	if(cartRepeatFlag.value) return false
	cartRepeatFlag.value = true
	cartStore.reduce({
		id: row.id,
		goods_id: row.goods_id,
		sku_id: row.sku_id,
		stock: row.stock,
		sale_price: row.sale_price,
		num: row.num
	}, 1, () => {
		cartRepeatFlag.value = false
	})

}

//进入购物车
const toCart = () => {
	redirect({ url: '/addon/shop/pages/goods/cart' })
}

/**
 * 结算
 */
const settlement = () => {
	// 绑定手机号
	if(uni.getStorageSync('isbindmobile')){
        bindMobileRef.value.open()
        return false
    }
	if (!totalNum.value) {
		uni.showToast({ title: '还没有选择商品', icon: 'none' })
		return
	}
	const ids:any = []
	Object.values(cartList.value).forEach(item => {
		Object.keys(item).forEach(v => {
			if (v != 'totalNum' && v != 'totalMoney') ids.push(item[v].id)
		})

	})
	uni.setStorage({
		key: 'orderCreateData',
		data: {
			cart_ids: ids
		},
		success() {
			redirect({ url: '/addon/shop/pages/order/payment' })
		}
	})
}

// 价格类型
const priceType = (data:any) =>{
	let type = "";
    if(data.is_discount && data.goodsSku.sale_price != data.goodsSku.price){
        type = 'discount_price'// 折扣
    }else if(data.member_discount && getToken() && data.goodsSku.member_price != data.goodsSku.price) {
        type = 'member_price' // 会员价
    }else{
        type = ""
    }
    return type;
}

// 商品价格
const goodsPrice = (data:any) =>{
	let price = "0.00";
    if (data.is_discount && data.goodsSku.sale_price != data.goodsSku.price) {
        price = data.goodsSku.sale_price ? data.goodsSku.sale_price : data.goodsSku.price // 折扣价
    } else if (data.member_discount && getToken() && data.goodsSku.member_price != data.goodsSku.price) {
        price = data.goodsSku.member_price ? data.goodsSku.member_price : data.goodsSku.price // 会员价
    } else {
        price = data.goodsSku.price
    }
    return price;
}
</script>

<style lang="scss" scoped>
.good-name-color {
  color: #ffffff;
}
::v-deep {
  .tabs-box .tab-item {
    background-color: #ffffff00 !important;
  }
}
.good-class {
  width: calc(50% - 12rpx);
  padding: 0;
  margin: 6rpx;
  display: block;
  background-color: #2f2f2f;
}
	.remove-border {
		&::after {
			border: none;
		}
	}
.border-color {
	border-color: var(--primary-color) !important;
}

.text-color {
	color: var(--primary-color) !important;
}

.bg-color {
	background-color: var(--primary-color) !important;
}

.class-select {
	position: relative;
	font-weight: bold;

	&::before {
		content: "";
		position: absolute;
		bottom: 0;
		height: 6rpx;
		background-color: var(--primary-color);
		width: 90%;
		left: 50%;
		transform: translateX(-50%);
	}
}

.list-select {
	position: relative;
	margin-right: 28rpx;

	&::before {
		content: "";
		position: absolute;
		background-color: #999;
		width: 2rpx;
		height: 70%;
		top: 50%;
		right: -14rpx;
		transform: translatey(-50%);
	}
}

.transform-rotate {
	transform: rotate(180deg);
}

.text-color {
	color: var(--primary-color);
}

.bg-color {
	background-color: var(--primary-color);
}

// search input
.search-box {
	 position: relative;
	padding: 20rpx 24rpx;
}

.search-box .search-ipt {
	height: 64rpx;
	background-color: #F6F8F8;
	padding-left: 20rpx;
	border-radius: 33rpx;
}

.search-box .search-ipt .input-placeholder {
	color: #A5A6A6;
}

.tabs-box {
	width: 182rpx;
	font-size: 28rpx;
}

.tabs-box .tab-item {
	height: 92rpx;
	text-align: center;
	line-height: 92rpx;
	background-color:#fff;
  color: #999999;
}

.tabs-box .tab-item-active {
	position: relative;
	color: #fff;
  background-image: url("../../../../../image/goods/tab-active.png");
  background-size: 100% 80%;
  background-repeat: no-repeat;
  background-position: center;
	&::before {
		display: none;
		position: absolute;
		left: 0rpx;
		top: 50%;
		transform: translateY(-50%);
		content: '';
		width: 6rpx;
		height: 48rpx;
		background-color: var(--primary-color);
	}

	&::after {
		display: none;
		position: absolute;
		left: 0rpx;
		top: 50%;
		transform: translateY(-50%);
		content: '';
		width: 6rpx;
		height: 48rpx;
		background-color: var(--primary-color);
	}
}

.scroll-height{
	height: 100%;
}
/*  #ifdef  H5  */
.cart{
	.noData1{
		height: calc(100vh - 146rpx - 100rpx - 50px - constant(safe-area-inset-bottom));
		height: calc(100vh - 146rpx - 100rpx - 50px - env(safe-area-inset-bottom));
	}
	.noData2{
		height: calc(100vh - 40rpx - 100rpx - 50px - constant(safe-area-inset-bottom));
		height: calc(100vh - 40rpx - 100rpx - 50px - env(safe-area-inset-bottom));
	}
}
.detail{
	.noData1{
		height: calc(100vh - 146rpx - 50px - constant(safe-area-inset-bottom));
		height: calc(100vh - 146rpx - 50px - env(safe-area-inset-bottom));
	}
	.noData2{
		height: calc(100vh - 40rpx - 50px - constant(safe-area-inset-bottom));
		height: calc(100vh - 40rpx - 50px - env(safe-area-inset-bottom));
	}
}
/*  #endif  */
/*  #ifndef  H5  */
.cart{
	.noData1{
		height: calc(100vh - 146rpx - 100rpx - 100rpx - constant(safe-area-inset-bottom));
		height: calc(100vh - 146rpx - 100rpx - 100rpx - env(safe-area-inset-bottom));
	}
	.noData2{
		height: calc(100vh - 40rpx - 100rpx - 100rpx - constant(safe-area-inset-bottom));
		height: calc(100vh - 40rpx - 100rpx - 100rpx - env(safe-area-inset-bottom));
	}
}
.detail{
	.noData1{
		height: calc(100vh - 146rpx - 100rpx - constant(safe-area-inset-bottom));
		height: calc(100vh - 146rpx - 100rpx - env(safe-area-inset-bottom));
	}
	.noData2{
		height: calc(100vh - 40rpx - 100rpx - constant(safe-area-inset-bottom));
		height: calc(100vh - 40rpx - 100rpx - env(safe-area-inset-bottom));
	}
}
/*  #endif  */
.title_st {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.input_st {
  background: #2F2F2F !important;
  border: 3rpx solid #B13F3F;
}
.dis_flex {
  flex-direction: column;
}
</style>
